<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>ALLADYN Project homepage</title>
<link rel="stylesheet" href="../al.css" type="text/css">
<script src="../js/Alladyn.js" type="text/javascript"></script>
<script>
<!--
function main() {
	with(vlay.rect1){
		vkf({left:490},1)
		vkf({left:580},20)
		van.go=true
	}
	with(vlay.rect2){
		vkf({left:490},1)
		vkf({left:580},20)
		van.go=true
		van.mode="loop"
	}
	with(vlay.rect3){
		vkf({left:490},1)
		vkf({left:580},20)
		van.go=true
		van.mode="ping"
	}
}
//-->
</script>
<style type="text/css">
<!--
	div { font-family: "Trebuchet MS", "MS Sans Serif", "Arial CE", Arial, "Helvetica CE", Helvetica, sans-serif; font-size: 13px; line-height: 20px; color:#DDDDFF; }
	.rect { position: absolute; background-color: #FF0000; layer-background-color: #FF0000; width: 50px; height: 50px; zIndex: 1; }
	#tekst { position: absolute; width: 450px; zIndex: 2; border-width: 1px; border-style: solid; border-color: #DDDDFF; padding: 10px; top: 45px; }
	#head { position: absolute; top: 10px; }
//-->
</style>
</head>

<body background="../img/bg.gif" onload="Alladyn();main()">
<div id="head"><a href="http://alladyn.art.pl"><img src="../img/docs_exhead_eng.gif" width="450" height="35" alt="" border="0"></a></div>
<div style="position: absolute; left: 490px; top: 330px;">Normal type</div>
<div id="rect1" class="rect" style="left: 490px; top: 350px;"><img src="../img/empty.gif" width="50" height="50" alt="" border="0"></div>
<div style="position: absolute; left: 490px; top: 430px;"><span class="i">loop</span> type</div>
<div id="rect2" class="rect" style="left: 490px; top: 450px;"><img src="../img/empty.gif" width="50" height="50" alt="" border="0"></div>
<div style="position: absolute; left: 490px; top: 530px;"><span class="i">ping</span> type</div>
<div id="rect3" class="rect" style="left: 490px; top: 550px;"><img src="../img/empty.gif" width="50" height="50" alt="" border="0"></div>
<div id="tekst">
<div class="content">
	<span class="b">Example 6.2</span><br />
	Defining various movement types using <span class="b">mode</span> property of the <span class="b">van</span> object.<br /><br />
	We define a movement model for the first layer, which uses normal movement type:
</div>
<div class="ex1">
	with(vlay.rect1){<br />
	&nbsp;&nbsp;&nbsp;&nbsp;vkf({left:490},1)<br />
	&nbsp;&nbsp;&nbsp;&nbsp;vkf({left:580},10)<br />
	&nbsp;&nbsp;&nbsp;&nbsp;van.go=true<br />
	}<br />
</div>
<div class="content">
	In the same way we define a movement model for the second layer, but we set the movement type to <span class="i">loop</span>:
</div>
<div class="ex1">
	with(vlay.rect2){<br />
	&nbsp;&nbsp;&nbsp;&nbsp;vkf({left:490},1)<br />
	&nbsp;&nbsp;&nbsp;&nbsp;vkf({left:580},10)<br />
	&nbsp;&nbsp;&nbsp;&nbsp;van.go=true<br />
	&nbsp;&nbsp;&nbsp;&nbsp;van.mode="loop"<br />
	}<br />
</div>
<div class="content">
	In the same way we define a movement model for the third layer, with movement type set to <span class="i">ping</span>:
</div>
<div class="ex1">
	with(vlay.rect3){<br />
	&nbsp;&nbsp;&nbsp;&nbsp;vkf({left:490},1)<br />
	&nbsp;&nbsp;&nbsp;&nbsp;vkf({left:580},10)<br />
	&nbsp;&nbsp;&nbsp;&nbsp;van.go=true<br />
	&nbsp;&nbsp;&nbsp;&nbsp;van.mode="ping"<br />
	}<br />
</div>
<div class="content">
	Now we can watch our animation calling <span class="i"><a href="javascript:STPE.go('',50)">STPE.go("",50)</a></span>

	<br /><br />
	<a href="javascript:history.back()">Back</a>
</div>
</div>
</body>
</html>

